<!doctype html>
<html lang="en-US">
<head>
  <meta charset="UTF-8">
  <script src="../jquery.min.js"></script>
  <script src="result_view.js"></script>
  <link rel="stylesheet" type="text/css" href="../bootstrap.css"/>
  <title>MonkeyTest Result</title>
  <style type="text/css">
      <!--
      .warning {
          color: red;
          font-size: 20px;
      }
      .event_box {
          position: relative;
          display: inline;
      }

      .event_text {
          font-size: 12px;
          position: absolute;
          display: none;
          width: 300px;
          height: 300px;
          padding: 3px;
          border: #000066 groove thick;
          background-color: #ffdead;
          border-radius: 10px;        /* CSS3草案 */
          -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
          -moz-border-radius: 10px;   /* Firefox用 */
      }

      .event_box:hover .event_text {
          left: 0px;
          display: inline;
          z-index: 10000;
      }
      -->
  </style>
</head>
<body>
  <br>
  <div class="container theme-showcase" role="main">
  <div class="jumbotron">
<% if crashed %>
  <center>
    <div class="alert alert-danger" role="alert">
      <h1>
        <strong>Crash!</strong>
          Application crashed during the monkey testing.
      </h1>
    </div>
  </center>
<% elsif no_run %>
  <center>
    <div class="alert alert-warning" role="alert">
      <h1>
        <strong>No run!</strong>
          Application not start monkey testing.
      </h1>
    </div>
  </center>
<% else %>
  <center>
    <div class="alert alert-success" role="alert">
      <h1>
        <strong>Well done!</strong>
          None crash happend.
      </h1>
    </div>
  </center>
<% end %>

<p>
  <center>
  <a class="btn btn-lg btn-warning" role="button"  href="../custom.js" style="font-size: 18px; text-align:center; height: 20px; width: 100px;">configuration</a>
  <a class="btn btn-lg btn-info" role="button"  href="console.txt" style="font-size: 18px; text-align:center; height: 20px; width: 100px;">system log</a>
  <% if uia_trace %>
    <a class="btn btn-lg btn-primary" role="button" href="./uiautomation.html" style="font-size: 18px; text-align:center; height: 20px; width: 100px;">uiauto trace</a>
  <% end %>
  <% if crash_report %>
    <a class="btn btn-lg btn-danger" role="button" href="<%= crash_report %>" style="font-size: 18px; text-align:center; height: 20px; width: 100px;">crash log</a>
  <% end %>
  </center>
</p>
</div>
</div>
<hr>

<% log_list.each_with_index do |_, i| %>
<% if i > 0 %>
<div class="event_box"><canvas id="log-<%= i %>"; style="border: 1px black solid"></canvas><div class="event_text" id="text-<%= i %>"></div></div>
<% end %>
<% end %>
<script type="text/javascript">
$(function() {
    MonkeyResult().configure({
        log_list: log_list_json(),
        view_prefix: 'log',
        text_prefix: 'text',
        image_size_rate: 1
    }).draw();
})

var log_list_json = function() {
    return <%= log_list_json %>;
}
</script>
</body>
</html>
